<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>设备库存管理系统</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script>
        tailwind.config = {
            theme: { extend: { colors: { primary: '#3B82F6' } } }
        }
    </script>
</head>
<body class="bg-gray-50">
    <!-- 导航栏 -->
    <nav class="bg-white shadow-md">
        <div class="max-w-7xl mx-auto px-4">
            <div class="flex justify-between h-16 items-center">
                <div class="text-xl font-bold text-primary">设备库存管理系统</div>
                <div class="flex space-x-4">
                    <a href="{{ url_for('index') }}">首页</a>
                    <a href="{{ url_for('device.management') }}">设备管理</a>
                    <a href="{{ url_for('stock.stock_in') }}">入库</a>
                    <a href="{{ url_for('stock.stock_out') }}">出库</a>
                </div>
            </div>
        </div>
    </nav>

    <!-- 主内容区 -->
    <main class="max-w-7xl mx-auto px-4 py-8">
        {% with messages = get_flashed_messages(with_categories=true) %}
            {% if messages %}
                <div class="fixed top-4 right-4 z-50">
                    {% for category, msg in messages %}
                        <div class="bg-{{ 'green-100' if category=='success' else 'red-100' }} p-4 mb-2 rounded">
                            {{ msg }}
                        </div>
                    {% endfor %}
                </div>
            {% endif %}
        {% endwith %}
        {% block content %}{% endblock %}
    </main>
</body>
</html>